<template>
  <div>
      <span>{{ time }}</span>
  </div>
</template>

<script>
import getTime from "../utils/getTime";
export default {
  data() {
    return {
      time: getTime(),
    };
  },
  mounted() {
      /*1. this 第一种写法 普通函数中的 this 指向是：在函数调用时，函数所在的对象 */
    let self = this;
    // window.serInterval()
    setInterval(function () {
      // this 指代的是window
      self.time = getTime();
    }, 1000);

    /*2. 使用箭头函数 this指向是：函数声明时，所在的对象 */
    // setInterval(() => {
    //     //this 指代的是vue组件
    //     this.time = getTime();
    //      }, 1000);
    // });
  },
};
</script>

<style scoped>
</style>